<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CMS-LOGIN</title>
<!--必要样式-->
	<link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="/static/css/login/login.css" />
<script src="/static/js/jquery-3.2.1.min.js"></script>
</head>
<body>
<div class="login-flex">
	<div class="login-item-left">
		<div class="login-item-image">
			<img src="/static/images/login/slogan.png">
		</div>
	</div>
	<div class="login-item-right">
		<div class="login-logo">
			<img src="/static/images/login/backend.png">
		</div>
		<div class="login-info">
			<div>登录 <span id="login-error" class="login-hidden"><img src="/static/images/login/warning.png">用户名或密码错误</span></div>
			<div class="login-acount ">
				<div><label>请输入账号</label></div>
				<input class="login-input login-div-bottom" id="account" type="text" autocomplete="off"/>
				<div class="input-load"></div>
			</div>
			<div class="login-password">
				<div ><label>请输入密码</label></div>
				<input class="login-input login-div-bottom" id="password" type="text" onfocus="this.type='password'" autocomplete="off" />
				<div class="input-load"></div>
			</div>
		</div>
		<div class="login-button">
			<a class="btn btn-default"> 登录</a>
		</div>
	</div>
</div>
</body>
<script src="/static/js/login/jquery.transit.js"></script>
<script>
	(function(){

	    /*判断是否填充内容*/
	    $('.login-input').focus(function(){
            $(this).prev('div').find('label').transition({x:-5,y:-25}).css({
                "font-size": "14px",
                "color": "#a8a8a8"
			});
            hideError();
		});
        $('.login-input').blur(function(){
            if(!$(this).val()){
                $(this).prev('div').find('label').transition({x:0,y:0}).css({
                    "font-size": "18px",
                    "color": "#a8a8a8"
                });
			}
        });
        $('.btn-default').on('click',function(){
            var account= $('#account').val().trim();
            var password= $('#password').val().trim();
            $.post("{:url('admin/auth/login')}",{
                account: account,
                password:password
            },function($data){
                if($data.code==0){
                    window.location.href="{:url('index/index/index')}";
                }else{
                    showError();
                }
            });
		});
        $(document).keypress(function(e) {
            // 回车键事件
            if(e.which == 13) {
                $('.btn-default').click();
            }
        });
        var dom = $('#login-error');
        function showError(){
            dom.removeClass('login-hidden');
            dom.addClass('move-span');
		}
		function hideError(){
            dom.removeClass('move-span');
            dom.addClass('login-hidden');
		}
	})();
</script>
</html>